<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ include file="../../../common/taglib.jsp"%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
	<head>
		<title>会员注册</title>
		<meta http-equiv="pragma" content="no-cache">
		<meta http-equiv="cache-control" content="no-cache">
		<meta http-equiv="expires" content="0">
		<link href="${ctx }/css/style.css" type="text/css" rel="stylesheet" />
		<script type="text/javascript" src="${ctx }/js/jquery/jquery-1.6.1.min.js"></script>
		<script type="text/javascript">
			$(function() {
				$("#btnSave").click(function() {
					$("form:first").submit();
				});

				$("#username").blur(function() {
					var username = $(this).val();

					var url = "${ctx}/user/checkUsername.action";

					var param = { "username": username };

					$.post(url, param, function(returnData) {
						if ("1" == returnData.result) {
							alert("用户名[" + username + "]已存在！");

							$("#btnSave").attr("disabled", "disabled");
						} else {
							$("#btnSave").attr("disabled", "");
						}
					});
				});
			});
		</script>
	</head>
	<body style="background-color: #336699; top: 0" topmargin="0">
		<center>
			<s:form action="userRegister" method="post" namespace="/user">
			<br />
			<div
				style="width: 500px; text-align: center; margin: 0 auto; background-color: #f4f4f4">

				<div
					style="text-align: center; width: 97%; height: 10px; background-color: #f4f4f4;">
					<b>会 员 注 册</b>
				</div>
				<div style="width: 97%; height: 15px"></div>
				<div class="alertText"
					style="text-align: center; width: 97%; background-color: #f4f4f4;">
					注：为了您的帐号安全，请务必认真填写！！
				</div>
				<br />

				<div
					style="width: 80%; height: 45px; text-align: left; margin: 0 auto; background-color: #F2EFD0; padding: 0px">
					<div
						style="float: left; width: 35%; height: 45px; line-height: 45px; text-align: right; vertical-align: middle;">
						用户登录名：
					</div>
					<div
						style="float: left; width: 64%; height: 45px; text-align: left; padding-top: 6px;">
						<s:textfield id="username" name="user.username"></s:textfield>
					</div>
				</div>

				<div
					style="width: 80%; height: 45px; text-align: left; margin: 0 auto; background-color: #F2EFD0; padding: 0px">
					<div
						style="float: left; width: 35%; height: 45px; line-height: 45px; text-align: right; vertical-align: middle;">
						密码：
					</div>
					<div
						style="float: left; width: 64%; height: 45px; text-align: left; padding-top: 6px;">
						<s:password id="password" name="user.password"></s:password>
					</div>

				</div>

				<div
					style="width: 80%; height: 45px; text-align: left; margin: 0 auto; background-color: #F2EFD0; padding: 0px">
					<div
						style="float: left; width: 35%; height: 45px; line-height: 45px; text-align: right; vertical-align: middle;">
						确认密码：
					</div>
					<div
						style="float: left; width: 64%; height: 45px; text-align: left; padding-top: 6px;">
						<s:password id="confirmPwd"></s:password>
					</div>
				</div>

				<div
					style="width: 80%; height: 45px; text-align: left; margin: 0 auto; background-color: #F2EFD0; padding: 0px">
					<div
						style="float: left; width: 35%; height: 45px; line-height: 45px; text-align: right; vertical-align: middle;">
						性别：
					</div>
					<div style="float: left; width: 64%; height: 45px; text-align: left; padding-top: 6px;">
						<s:radio list="#{1:'男',0:'女'}" name="user.gender" value="1"></s:radio>
					</div>
				</div>

				<div
					style="width: 80%; height: 45px; text-align: left; margin: 0 auto; background-color: #F2EFD0; padding: 0px">
					<div
						style="float: left; width: 35%; height: 45px; line-height: 45px; text-align: right; vertical-align: middle;">
						密码问题：
					</div>
					<div
						style="float: left; width: 64%; height: 45px; text-align: left; padding-top: 6px;">
						<s:textfield name="user.question"></s:textfield>
					</div>
				</div>

				<div
					style="width: 80%; height: 45px; text-align: left; margin: 0 auto; background-color: #F2EFD0; padding: 0px">
					<div
						style="float: left; width: 35%; height: 45px; line-height: 45px; text-align: right; vertical-align: middle;">
						密码答案：
					</div>
					<div
						style="float: left; width: 64%; height: 45px; text-align: left; padding-top: 6px;">
						<s:textfield name="user.answer"></s:textfield>
					</div>
					<div style="float: left; text-align: left; text-align: left;"
						class="alertText">
						<span style="color: #ff0000"></span>
					</div>
				</div>

				<div
					style="width: 80%; height: 46px; text-align: left; margin: 0 auto; background-color: #F2EFD0; padding: 0px">
					<div
						style="float: left; width: 35%; height: 46px; line-height: 45px; text-align: right; vertical-align: middle;">
						Email：
					</div>
					<div
						style="float: left; width: 64%; height: 46px; text-align: left; padding-top: 6px;">
						<s:textfield name="user.email"></s:textfield>
					</div>

				</div>

				<div
					style="width: 80%; height: 45px; text-align: left; margin: 0 auto; background-color: #F2EFD0; padding: 0px">
					<div
						style="float: left; width: 35%; height: 45px; line-height: 45px; text-align: right; vertical-align: middle;">
						电话：
					</div>
					<div
						style="float: left; width: 64%; height: 45px; text-align: left; padding-top: 6px;">
						<s:textfield name="user.telephone"></s:textfield>
					</div>
				</div>

				<div
					style="width: 80%; height: 45px; text-align: left; margin: 0 auto; background-color: #F2EFD0; padding: 0px">
					<div
						style="float: left; width: 35%; height: 45px; line-height: 45px; text-align: right; vertical-align: middle;">
						地址：
					</div>
					<div
						style="float: left; width: 64%; height: 45px; text-align: left; padding-top: 6px;">
						<s:textfield name="user.address"></s:textfield>
					</div>
				</div>

				<div
					style="width: 80%; height: 45px; text-align: left; margin: 0 auto; background-color: #F2EFD0; padding: 0px">
					<div
						style="float: left; width: 35%; height: 45px; line-height: 45px; text-align: right; vertical-align: middle;">
						身份证号：
					</div>
					<div
						style="float: left; width: 64%; height: 45px; text-align: left; padding-top: 6px;">
						<s:textfield name="user.idCard"></s:textfield>
					</div>
				</div>
				<div
					style="width: 80%; height: 35px; background-color: #F2EFD0; padding-top: 10px">
					<input type="button" id="btnSave" value="提交" class="button" style="width: 72px; cursor: hand;" />
					<input type="reset" value="全部重写" class="botton" style="cursor: hand" />
				</div>
				<br />
			</div>
		</s:form>
		</center>
	</body>
</html>
